{extend name="public/layout"}
{block name="title"}排行榜{/block}
{block name="head"}
<style>
    html, body {
        background-color: #fff;
    }

    .banner {
        height: 3.744rem;
        background: url("/images/banners/banner.png") no-repeat center center;
        background-size: cover;
    }

    .msg .h1 {
        padding-bottom: 0.15rem;
        padding-top: 0.05rem;
    }

    .msg img.avatar {
        width: 0.5088rem;
        height: 0.5088rem;
        border-radius: 50%;
        position: absolute;
        top:0.235rem;
        right:0.245rem;
    }
    .rank{
        width:0.6rem;
    }
    .rank img{
        width:0.4rem;
    }
    .rank b{
        padding-left:0.1rem;
        color:#999999;
        font-size:0.3rem;
    }
    .avatar-wrapper{
        background: url("/images/avatar-bg.png") no-repeat;
        -webkit-background-size:cover;
        background-size:cover;
        width: 0.9888rem;
        height:0.9792000000000001rem;
        margin-right: 0.2rem;
        position: relative;

    }

</style>
{/block}
{block name="content"}
<div class="banner">

</div>
<div class="flex toolbar border-b">
    <div class="flex-con active">
        <img src="/images/person2.png" alt="">
        个人排行榜
    </div>

    <a class="flex-con" href="{:U('ranklist2')}">
        <img src="/images/com.png" alt="">
        企业排行榜
    </a>
</div>
<div class="hr"></div>
<div class="msg-list">
    {volist name="ranklist" id="vo"}
    <div class="msg border-b flex">

        {if $key gt 2}
        <div class="rank h0">
            <b>
                {$key+1}
            </b>
        </div>
        {else/}
        <div class="rank">
            <img src="/images/icons/th{$key+1}.png" alt="">
        </div>
        {/if}

        <div class="avatar-wrapper">
            <img src="{$vo.avatar}" alt="" class="avatar">
        </div>

        <div class="flex-con">
            <div class="h1 b">{$vo.nickname}</div>
            <div class="h5 text-gray">{$vo.msg|default='我要为环保事业出一份绵薄之力'}</div>
        </div>
        <div class="h6 text-gray text-right">
            <span class="text-primary h1">{$vo.days*0.01}</span> KG
        </div>
    </div>
    {/volist}

</div>


{/block}